<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>TreeGrid Actions - jQuery EasyUI Demo</title>
	<link rel="stylesheet" type="text/css" href="<%=path%>/css/css_add/css/easyui.css">
	<link rel="stylesheet" type="text/css" href="<%=path%>/css/css_add/css/icon.css">
	<link rel="stylesheet" type="text/css" href="<%=path%>/css/css_add/css/demo.css">
	<script type="text/javascript" src="<%=path%>/css/css_add/js/jquery.min.js"></script>
	<script type="text/javascript" src="<%=path%>/css/css_add/js/jquery.easyui.min.js"></script>
</head>
<body>
	<h2>TreeGrid Actions</h2>
	<p>Click the buttons below to perform actions.</p>
	<div style="margin:20px 0;">
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="collapseAll()">CollapseAll</a>
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="expandAll()">ExpandAll</a>
		<a href="#" class="easyui-linkbutton" onclick="">add</a>
		<a href="#" class="easyui-linkbutton" onclick="selectContent()">delete</a>
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="update()">update</a>
	</div>
	<table id="tg" class="easyui-treegrid" title="TreeGrid Actions" style="width:700px;height:250px"
			data-options="
				//iconCls: 'icon-ok',
				rownumbers: false,
				singleSelect: true,
				animate: true,
				collapsible: true,
				fitColumns: true,
				url: '<%=path%>/treegrid_data4.json',
				method: 'get',
				idField: 'sid',
				treeField: 'fname',
		">
		<thead>
		    
			<tr>

			    <th data-options="field:'ck',checkbox:true" id="checkbox"></th>
				<th data-options="field:'fid',width:60">项目类型编号</th>
				<th data-options="field:'fname',width:180,align:'left'">项目名称</th>
				<th data-options="field:'sid',width:180,align:'left'">子项目编号</th>
				<th data-options="field:'sname',width:180,align:'left'">子项目名称</th>
			</tr>
			
		</thead>
	</table>
	<script type="text/javascript">
		function collapseAll(){
			$('#tg').treegrid('collapseAll');
		}
		function expandAll(){
			$('#tg').treegrid('expandAll');
		}
		function selectContent(){
		
		    var row=$("#tg").datagrid("getSelected");
			
            alert(row.fid);
		}
	</script>
	
</body>
</html>